<template>
	<view class="setting-container">
	  <uni-row class="demo-uni-row">
	  	<uni-col :span="12">
	  		<uni-card @tap.native="openRFID">
				<view class="grid-item-box">
					<uni-icons type="scan" size="30"></uni-icons>
					<text >读取RFID</text>
				</view>
	  		</uni-card>
	  	</uni-col>
	  	<uni-col :span="12">
	  		<uni-card @tap.native="toscan">
				<view class="grid-item-box">
					<uni-icons type="scan" size="30"></uni-icons>
					<text>扫码条码</text>
				</view>
	  		</uni-card>
	  	</uni-col>
	  </uni-row>
	  <uni-card style="min-height: 260rpx;padding: 10rpx;">
		  <text style="font-size: 1.2em;">当前产品Code：</text>
		  <input class="uni-input" placeholder="RFID编码" v-model="search" style="width: 100;border-bottom: 1px #000 solid;margin-top: 30rpx;"/>
		  <button type="primary" size="mini" style="width: 100%;margin-top: 25rpx;" @click="doSearch">查询工单</button>
	  </uni-card>
	  <uni-card style="min-height: 500rpx;">
	  	<uni-table ref="table" :loading="loading" border stripe emptyText="暂无更多数据">
			<uni-tr>
				<uni-th width="80" align="center">零件号</uni-th>
				<uni-th width="60" align="center">工序<br>编号</uni-th>
				<uni-th width="90" align="center">工序<br>名称</uni-th>
				<uni-th width="80">任务<br>状态</uni-th>
			</uni-tr>
			<uni-tr v-for="(item, index) in pageMix.records" :key="index" @tap.native="openInfo(item)" :style="item.nextProcessNo===item.processNo?'background-color: aquamarine;':''">
				<uni-td align="center">{{ item.partNo }}</uni-td>
				<uni-td align="center">{{ item.processNo }}</uni-td>
				<uni-td align="center">{{ item.processName }}</uni-td>
				<uni-td>{{ item.processState }}</uni-td>
			</uni-tr>
		</uni-table>
		<view class="uni-pagination-box"><uni-pagination show-icon :page-size="pageMix.size" :current="pageMix.current" :total="pageMix.total" @change="pagination"/></view>
	  </uni-card>
	  <!-- 普通弹窗 -->
	  <uni-popup ref="popup">
		<uni-card title="任务信息" :extra="'标签：'+ infoData.tagCode" style="width: 90vw;">
			<uni-row>
				<uni-col :span="6" style="text-align: right;">零件号： </uni-col>
				<uni-col :span="18">{{infoData.partNo}}</uni-col>
				<uni-col :span="6" style="text-align: right;">流水号： </uni-col>
				<uni-col :span="18">{{infoData.productSerialNo}}</uni-col>
				<uni-col :span="6" style="text-align: right;">标准数量： </uni-col>
				<uni-col :span="18">{{infoData.standardQuantity}}</uni-col>
				<uni-col :span="6" style="text-align: right;">材料炉号： </uni-col>
				<uni-col :span="18">{{infoData.materialNo}}</uni-col>
				<uni-col :span="6" style="text-align: right;">工序号： </uni-col>
				<uni-col :span="18">{{infoData.processNo}}</uni-col>
				<uni-col :span="6" style="text-align: right;">工序名称： </uni-col>
				<uni-col :span="18">{{infoData.processName}}</uni-col>
			</uni-row>
			<div style="height: 40rpx;"></div>
			<uni-forms ref="baseForm" label-position="top">
				<uni-forms-item label="所用设备">
					<view style="border: #e6e6e6 1px solid;border-radius:3px;height: 70rpx;padding:10rpx;">
						<picker mode="selector" @change="bindPickerChange" :value="index" :range="machineArray" range-key="name">
							<view v-if="machineArray.length!=0">{{machineArray[index].name}}</view>
						</picker>
					</view>
				</uni-forms-item>
				<uni-forms-item label="领用数量">
					<uni-easyinput type="number" v-model="infoData.receipts" placeholder="请输领料数量" />
				</uni-forms-item>
			</uni-forms>
			<uni-row>
				<uni-col :span="12" style="padding: 10rpx;">
					<button size="mini" style="width: 100%;margin-top: 25rpx;" @click="closeInfo">取消</button>
				</uni-col>
				<uni-col :span="12" style="padding: 10rpx;">
					<button type="primary" size="mini" style="width: 100%;margin-top: 25rpx;" @click="updateInfo">领料上工</button>
				</uni-col>
			</uni-row>
		</uni-card>
	  </uni-popup>
	  <uni-popup ref="rfidPopup">
	  		<uni-card title="RFID" style="width: 90vw;">
	  			<!-- 显示圆形头像 -->
				<uni-list-chat v-for="(item,index) in rfidArray" :avatar-circle="true" title="RFID编码" :avatar="avatar" :note="item" @tap.native="rfidOK(item)"></uni-list-chat>
	  			<uni-row>
	  				<uni-col :span="24" style="padding: 10rpx;">
	  					<button size="mini" style="width: 100%;margin-top: 25rpx;" @click="closeRFID">取消</button>
	  				</uni-col>
	  			</uni-row>
	  		</uni-card>
	  </uni-popup>
	</view>
</template>

<script>
  const apis = require('@/api/wip/WipTraceTask.js');
  const machineApis = require('@/api/wip/WipMachine.js');
  const rfidApis = require('@/api/wip/WipRfid.js');
  const uhfSerial = uni.requireNativePlugin("uniplugin_uhf");
  const globalEvent = uni.requireNativePlugin('globalEvent');
  export default {
  	data() {
  		return {
			avatar: require("@/static/images/rfid.png"),
			serialPortPath:"/dev/ttyS1",
			index:0,
  			pageMix : apis.PageMix,
  			search : null,
  			entityPut : apis.entityPut,
  			entityPo : apis.entityPo,
  			loading: false,
			infoData:{
				partNo:null
			},
			time : null,
			rfidArray: [],
			machineArray: [],
			barcode:null
  		}
  	},
  	onLoad() {
		this.loadTable()

		var that = this;
		/**
		 * 端口监听方法，调用uniapp 监听事件 usbListener
		 * @param e 监听到的数据
		 */
		globalEvent.addEventListener('uhfListener', function(e) {
			that.rfidArray =e.data.map(item => item.slice(0, -2));
			that.time = e.time
		});
  	},
  	methods: {
		bindPickerChange: function(e) {
			this.index=e.detail.value
			this.infoData.startPosition = this.machineArray[e.detail.value].name
		},
		// 创建Barcode扫码控件
		toscan: function() {
			let that = this
			uni.scanCode({
				success: function (res) {
					that.search=res.result
					that.doSearch()
				}
			});
		},
		connect(){
			let json = uhfSerial.connect(this.serialPortPath);
		},
		disconnect(){
			let json = uhfSerial.disconnect();
		},
		loadTable(){
  		    apis.pageMixJoin(this.pageMix).then(response => {
  		          if(response.code===200){
  		            this.pageMix=response.data;
  		            this.pageMix.current=parseInt(response.data.current)
  		            this.pageMix.size=parseInt(response.data.size)
  		            this.pageMix.total=parseInt(response.data.total)
  		          }
  		        })
  		        .catch(error => {
  		          console.error('发生错误：', error);
  		        });
  		  },
		  loadMaterial(){
			  apis.getMachineListByProcessNO(this.infoData.processNo,this.infoData.partNo)
				  .then(response => {
					if(response.code===200){
					  this.machineArray=response.data
					}
				  })
				  .catch(error => {
					console.error('发生错误：', error);
				  });
		  },
		  pagination(type){
			  this.pageMix.current = type.current
			  this.loadTable()
		  },
		  doSearch(){
			  this.pageMix.queryEntity.tagCode = this.search
			  this.loadTable()
		  },
		  openRFID(){
			this.connect()
			this.$refs.rfidPopup.open()
		  },
		  closeRFID(){
			this.disconnect()
			this.$refs.rfidPopup.close()
		  },
		  rfidOK(code){
			this.$refs.rfidPopup.close() 
			this.search= code
			this.doSearch()
		  },
		  openInfo(data){
			  if(data.nextProcessNo===data.processNo){
				  this.infoData=data
				  this.loadMaterial()
				  this.$refs.popup.open()
				  rfidApis.entityPo.tagCode=this.infoData.tagCode
				  rfidApis.findOne(rfidApis.entityPo).then(response => {
					  if(response.code===200){
						this.infoData.receipts=response.data.quantity
					  }
				  })
			  }else{
				  uni.showToast({
					  title: '请按顺序执行',
					  icon: "error",
					  duration: 2000
				  })
			  }
			
		  },
		  closeInfo(){
			this.$refs.popup.close()
		  },
		  updateInfo(){
			  const time = new Date(); //创建一个日期对象
			  const year = time.getFullYear(); // 年
			  const month = (time.getMonth() + 1).toString().padStart(2, '0'); // 月
			  const date = time.getDate().toString().padStart(2, '0'); // 日
			  const hour = time.getHours().toString().padStart(2, '0'); // 时
			  const minute = time.getMinutes().toString().padStart(2, '0'); // 分
			  const second = time.getSeconds().toString().padStart(2, '0'); // 秒
			  this.infoData.startTime=year + "-" + month + "-" + date + " " + hour + ":" + minute + ":" + second;
			  this.infoData.startBy=this.$store.state.user.name
			  this.infoData.processState="已上工"
			  apis.start(this.infoData)
				  .then(response => {
					if(response.code===200){
					  this.loadTable()
					  this.$refs.popup.close()
					}
				  })
				  .catch(error => {
					console.error('发生错误：', error);
				  });
		  }
  	}
  }
</script>

<style>
	.grid-item-box {
	  flex: 1;
	  /* #ifndef APP-NVUE */
	  display: flex;
	  /* #endif */
	  flex-direction: column;
	  align-items: center;
	  justify-content: center;
	  padding: 15px 0;
	}
</style>